/*
 * @Author: weidewei
 * @Date: 2025-05-14 09:24:54
 * @LastEditors: weidewei
 * @LastEditTime: 2025-05-14 17:23:26
 * @Description:
 * @FilePath: \2025-front-face\vue\vue2\v2\src\store\index.js
 */
import Vue from "vue";
import Vuex from "vuex";
Vue.use(Vuex);
/**
 * 使用Webpack的require.context动态加载Vuex模块
 * 参数说明：
 *   './modules' - 要扫描的目录路径
 *   true       - 是否扫描子目录
 *   /\.js$/    - 匹配所有.js结尾的文件
 */
const modulesFiles = require.context("./modules", true, /\.js$/);

/**
 * 将匹配到的模块文件转换为Vuex模块对象
 *
 * 转换过程：
 * 1. 遍历所有匹配到的模块文件路径
 * 2. 从文件路径中提取模块名称
 * 3. 加载模块内容
 * 4. 构建{ 模块名: 模块内容 }的结构
 */
const modules = modulesFiles.keys().reduce(
  (module, modulePath) => {
    /**
     * 从文件路径中提取模块名称：
     * 例如：'./user.js' → 'user'
     *       './settings/theme.js' → 'settings/theme'
     */
    const moduleName = modulePath.replace(/^\.\/(.*)\.\w+$/, "$1");

    /**
     * 加载模块文件内容
     * modulesFiles(modulePath)返回模块对象
     * value.default获取模块的默认导出
     */
    const value = modulesFiles(modulePath);

    // 将模块添加到累积对象中
    module[moduleName] = value.default;

    return module;
  },
  {} /* 初始值为空对象 */
);

/**
 * 最终生成的modules对象结构示例：
 * {
 *   user: { namespaced: true, state: {...}, ... },
 *   cart: { namespaced: true, state: {...}, ... },
 *   'settings/theme': { namespaced: true, ... }
 * }
 */

const store = new Vuex.Store({
  modules,
});

export default store;
